<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Home Page</title>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css">
    <link rel="stylesheet" type="text/css" href="../inc/bootstrap.css">
</head>
<body>
        <? include('../inc/header.php'); ?>
        <div class="container">
			<? include('../inc/nav.php'); ?>
            <div id="contents" class="yui3-skin-sam">
            	
            	<input type="text" class="typeahead" placeholder="bootstrap">
            	<input type="text" class="autocomplete" placeholder="jQueryUI" />
            	<input type="text" id="ac-input" placeholder="Yahoo UI" />
            </div>
       </div>
    <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <script type="text/javascript" src="../inc/bootstrap.js"></script>
    <script src="http://yui.yahooapis.com/3.8.0/build/yui/yui-min.js"></script>
	<script type="text/javascript">
		$(function(){
			BoostrapTypeAhead = function(a1, a2){
				b = a1;
				$.getJSON("../Api/Cities.php", {q : a1}, function(data){
							a2(data);
				});
			};
			$(".typeahead").typeahead({source: BoostrapTypeAhead});
			$(".autocomplete").autocomplete({source: "../Api/Cities.php"});
			
			
		});
		YUI().use('autocomplete', function (Y) {
			
			Y.one('#ac-input').plug(Y.Plugin.AutoComplete, {
			  source: '../Api/Cities.php?q={query}'
			});
		});
   </script>    
</body>
</html>


